import { createBrowserRouter, Navigate, Outlet, useLocation } from 'react-router-dom';
import { useEffect } from 'react';
import { ErrorBoundary } from '../components/ErrorBoundary';

import P_home from '../pages/p-home';
import P_login from '../pages/p-login';
import P_register from '../pages/p-register';
import P_forgot_password from '../pages/p-forgot_password';
import P_course_list from '../pages/p-course_list';
import P_course_detail from '../pages/p-course_detail';
import P_enroll_confirm from '../pages/p-enroll_confirm';
import P_personal_center from '../pages/p-personal_center';
import P_enrolled_courses from '../pages/p-enrolled_courses';
import P_personal_info from '../pages/p-personal_info';
import P_account_security from '../pages/p-account_security';
import P_messages from '../pages/p-messages';
import P_about_us from '../pages/p-about_us';
import P_help_center from '../pages/p-help_center';
import P_privacy_policy from '../pages/p-privacy_policy';
import P_user_agreement from '../pages/p-user_agreement';
import TestApiPage from '../pages/test-api';
import NotFoundPage from './NotFoundPage';
import ErrorPage from './ErrorPage';

function Listener() {
  const location = useLocation();
  useEffect(() => {
    const pageId = 'P-' + location.pathname.replace('/', '').toUpperCase();
    console.log('当前pageId:', pageId, ', pathname:', location.pathname, ', search:', location.search);
    if (typeof window === 'object' && window.parent && window.parent.postMessage) {
      window.parent.postMessage({
        type: 'chux-path-change',
        pageId: pageId,
        pathname: location.pathname,
        search: location.search,
      }, '*');
    }
  }, [location]);

  return <Outlet />;
}

// 使用 createBrowserRouter 创建路由实例
const router = createBrowserRouter([
  {
    path: '/',
    element: <Listener />,
    children: [
      {
    path: '/',
    element: <Navigate to='/home' replace={true} />,
  },
      {
    path: '/home',
    element: (
      <ErrorBoundary>
        <P_home />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/login',
    element: (
      <ErrorBoundary>
        <P_login />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/register',
    element: (
      <ErrorBoundary>
        <P_register />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/forgot-password',
    element: (
      <ErrorBoundary>
        <P_forgot_password />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/course-list',
    element: (
      <ErrorBoundary>
        <P_course_list />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/course-detail',
    element: (
      <ErrorBoundary>
        <P_course_detail />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/enroll-confirm',
    element: (
      <ErrorBoundary>
        <P_enroll_confirm />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/personal-center',
    element: (
      <ErrorBoundary>
        <P_personal_center />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/enrolled-courses',
    element: (
      <ErrorBoundary>
        <P_enrolled_courses />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/personal-info',
    element: (
      <ErrorBoundary>
        <P_personal_info />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/account-security',
    element: (
      <ErrorBoundary>
        <P_account_security />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/messages',
    element: (
      <ErrorBoundary>
        <P_messages />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/about-us',
    element: (
      <ErrorBoundary>
        <P_about_us />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/help-center',
    element: (
      <ErrorBoundary>
        <P_help_center />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/privacy-policy',
    element: (
      <ErrorBoundary>
        <P_privacy_policy />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/user-agreement',
    element: (
      <ErrorBoundary>
        <P_user_agreement />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '/test-api',
    element: (
      <ErrorBoundary>
        <TestApiPage />
      </ErrorBoundary>
    ),
    errorElement: <ErrorPage />,
  },
      {
    path: '*',
    element: <NotFoundPage />,
  },
    ]
  }
]);

export default router;